<template>
  <div id="recruitlist">
    <el-breadcrumb separator=">">
      <el-breadcrumb-item :to="{ path: '/' }">系统首页</el-breadcrumb-item>
      <el-breadcrumb-item>公开招聘</el-breadcrumb-item>
    </el-breadcrumb>
    <section class="wboxs">
    <!--工具条-->
        <el-form :inline="true" :model="filters">
          <div>
            <el-form-item style="float:left" label="当前年度">
              <el-select v-model="theYear" @change="getYearDetail" :loading="tableLoading">
                <!-- <el-option :value="theYear" :label="theYear" /> -->
                <el-option v-for="(item,index) in yearList" :key="'year'+index" :value="item" :label="item" />
              </el-select>
            </el-form-item>
            <div style="float:right">
              <el-form-item>
                <!-- <el-button type="success" @click="baseInfo" >基础信息维护</el-button> -->
                <el-button type="primary" @click="personInfo" >历年招聘人员留存库维护</el-button>
                <el-button type="success" v-if="isReviewUser" @click="audit" >预审</el-button>
              </el-form-item>
            </div>
          </div>
        </el-form>
    </section>
    <section class="wboxd" style="margin-top:10px">
      <!--列表-->
      <table width="100%" class="recruitTable" v-loading="tableLoading">
        <tr>
          <th>环节</th>
          <th>项目</th>
          <th style="width:600px">进展</th>
          <th style="width:200px">操作</th>
        </tr>
        <tr>
          <td rowspan="2">制定年度公开招聘计划</td>
          <td>计划申报</td>
          <td style="position:relative">
            <div v-if="planDeclare.state===0" style="width:100px;margin:0 auto"><i class="custom icon_c_1" /> 未提交</div>
            <el-tooltip v-else-if="planDeclare.state===1" :content="planDeclare.submitTime+'提交'" placement="top" :open-delay="600">
              <div style="width:100px;margin:0 auto"><i :class="'custom icon_c_2'" /> 已提交</div>
            </el-tooltip>
            <el-tooltip v-else-if="planDeclare.state===5" :content="planDeclare.backTime+'退回，原因：'+planDeclare.remarks" placement="top" :open-delay="600">
              <div style="width:100px;margin:0 auto"><i :class="'custom icon_c_3'" /> 已退回</div>
            </el-tooltip>
          </td>
          <td><el-button type="primary" @click="doit(1)">查看</el-button></td>
        </tr>
        <tr>
          <td>计划下达</td>
          <td style="position:relative">
            <div v-if="planRelease.state===0" style="width:100px;margin:0 auto"><i class="custom icon_c_0" /> 未下达</div>
            <el-tooltip v-else-if="planRelease.state===1" :content="planRelease.submitTime+'提交'" placement="top" :open-delay="600">
              <div style="width:100px;margin:0 auto"><i :class="'custom icon_c_2'" /> 已下达</div>
            </el-tooltip>
          </td>
          <td><el-button type="primary" @click="doit(2)">查看</el-button></td>
        </tr>
        <tr>
          <td>制定年度公开招聘工作方案</td>
          <td>岗位对接方案</td>
          <!-- <td style="position:relative">
            <span style="line-height:50px;padding-right:10px;">{{(UnitStepStates.interviewerResultsCount1?UnitStepStates.interviewerResultsCount1:0)+' / '+UnitStepStates.postReserveCount}}</span>
            <span style="padding:20px 10px;float:left;width:480px"><el-progress :stroke-width="10" :show-text="false" :percentage="100*(UnitStepStates.interviewerResultsCount1?UnitStepStates.interviewerResultsCount1:0)/UnitStepStates.postReserveCount"></el-progress></span>
          </td> -->
          <td style="position:relative">
            <template v-if="planRelease.state===1&&planDeclare.state===1">
              <div v-if="postDocking.state===0" style="width:100px;margin:0 auto"><i class="custom icon_c_1" /> 未提交</div>
              <el-tooltip v-else-if="postDocking.state===1" :content="postDocking.submitTime+'提交'" placement="top" :open-delay="600">
                <div style="width:100px;margin:0 auto"><i :class="'custom icon_c_2'" /> 已提交</div>
              </el-tooltip>
              <el-tooltip v-else-if="postDocking.state===5" :content="postDocking.backTime+'退回，原因：'+postDocking.remarks" placement="top" :open-delay="600">
                <div style="width:100px;margin:0 auto"><i :class="'custom icon_c_3'" /> 已退回</div>
              </el-tooltip>
            </template>
            <div v-else style="width:100px;margin:0 auto"><i class="custom icon_c_0" /> 未开始</div>
          </td>
          <td><el-button type="primary" @click="doit(3)">查看</el-button></td>
        </tr>
        <tr>
          <td>发布招聘岗位、资格条件等招聘信息</td>
          <td>招聘公告</td>
          <td style="position:relative">
            <template v-if="planRelease.state===1&&planDeclare.state===1&&postDocking.state===1">
              <span style="line-height:50px;padding-right:10px;">{{(UnitStepStates.announcementCount4?UnitStepStates.announcementCount4:0)+' / '+UnitStepStates.postReserveCount}}</span>
              <span style="padding:20px 10px;float:left;width:480px"><el-progress :stroke-width="10" :show-text="false" :percentage="100*(UnitStepStates.announcementCount4?UnitStepStates.announcementCount4:0)/UnitStepStates.postReserveCount"></el-progress></span>
            </template>
            <div v-else style="width:100px;margin:0 auto"><i class="custom icon_c_0" /> 未开始</div>
          </td>
          <td><el-button type="primary" @click="doit(4)">查看</el-button></td>
        </tr>
        <tr>
          <td>审查应聘人员资格条件</td>
          <td>审查应聘人员资格条件</td>
          <td style="position:relative">
            <template v-if="planRelease.state===1&&planDeclare.state===1&&postDocking.state===1">
              <span style="line-height:50px;padding-right:10px;">{{(UnitStepStates.qualificationCount1?UnitStepStates.qualificationCount1:0)+' / '+UnitStepStates.postReserveCount}}</span>
              <span style="padding:20px 10px;float:left;width:480px"><el-progress :stroke-width="10" :show-text="false" :percentage="100*(UnitStepStates.qualificationCount1?UnitStepStates.qualificationCount1:0)/UnitStepStates.postReserveCount"></el-progress></span>
            </template>
            <div v-else style="width:100px;margin:0 auto"><i class="custom icon_c_0" /> 未开始</div>
          </td>
          <td><el-button type="primary" @click="doit(5)">查看</el-button></td>
        </tr>
        <tr>
          <td rowspan="2">面试</td>
          <td>面试考官备案</td>
          <td style="position:relative">
            <template v-if="planRelease.state===1&&planDeclare.state===1&&postDocking.state===1">
              <span style="line-height:50px;padding-right:10px;">{{(UnitStepStates.interviewerFilingCount1?UnitStepStates.interviewerFilingCount1:0)+' / '+UnitStepStates.postReserveCount}}</span>
              <span style="padding:20px 10px;float:left;width:480px"><el-progress :stroke-width="10" :show-text="false" :percentage="100*(UnitStepStates.interviewerFilingCount1?UnitStepStates.interviewerFilingCount1:0)/UnitStepStates.postReserveCount"></el-progress></span>
            </template>
            <div v-else style="width:100px;margin:0 auto"><i class="custom icon_c_0" /> 未开始</div>
          </td>
          <td><el-button type="primary" @click="doit(6)">查看</el-button></td>
        </tr>
        <tr>
          <td>面试成绩上传</td>
          <td style="position:relative">
            <template v-if="planRelease.state===1&&planDeclare.state===1&&postDocking.state===1">
              <span style="line-height:50px;padding-right:10px;">{{(UnitStepStates.interviewerResultsCount1?UnitStepStates.interviewerResultsCount1:0)+' / '+UnitStepStates.postReserveCount}}</span>
              <span style="padding:20px 10px;float:left;width:480px"><el-progress :stroke-width="10" :show-text="false" :percentage="100*(UnitStepStates.interviewerResultsCount1?UnitStepStates.interviewerResultsCount1:0)/UnitStepStates.postReserveCount"></el-progress></span>
            </template>
            <div v-else style="width:100px;margin:0 auto"><i class="custom icon_c_0" /> 未开始</div>
          </td>
          <td><el-button type="primary" @click="doit(7)">查看</el-button></td>
        </tr>
        <!-- <tr>
          <td>考察</td>
          <td style="position:relative">
            <template v-if="planRelease.state===1&&planDeclare.state===1&&postDocking.state===1">
              <span style="line-height:50px;padding-right:10px;">{{(UnitStepStates.investigateCount1?UnitStepStates.investigateCount1:0)+' / '+UnitStepStates.postReserveCount}}</span>
              <span style="padding:20px 10px;float:left;width:480px"><el-progress :stroke-width="10" :show-text="false" :percentage="100*(UnitStepStates.investigateCount1?UnitStepStates.investigateCount1:0)/UnitStepStates.postReserveCount"></el-progress></span>
            </template>
            <div v-else style="width:100px;margin:0 auto"><i class="custom icon_c_0" /> 未开始</div>
          </td>
          <td><el-button type="primary" @click="doit(8)">查看</el-button></td>
        </tr>
        <tr>
          <td>体检</td>
          <td style="position:relative">
            <template v-if="planRelease.state===1&&planDeclare.state===1&&postDocking.state===1">
              <span style="line-height:50px;padding-right:10px;">{{(UnitStepStates.physicalExaminationCount1?UnitStepStates.physicalExaminationCount1:0)+' / '+UnitStepStates.postReserveCount}}</span>
              <span style="padding:20px 10px;float:left;width:480px"><el-progress :stroke-width="10" :show-text="false" :percentage="100*(UnitStepStates.physicalExaminationCount1?UnitStepStates.physicalExaminationCount1:0)/UnitStepStates.postReserveCount"></el-progress></span>
            </template>
            <div v-else style="width:100px;margin:0 auto"><i class="custom icon_c_0" /> 未开始</div>
          </td>
          <td><el-button type="primary" @click="doit(9)">查看</el-button></td>
        </tr> -->
        <tr>
          <td>择优确定拟聘用人员</td>
          <td>确认拟聘人选</td>
          <td style="position:relative">
            <template v-if="planRelease.state===1&&planDeclare.state===1&&postDocking.state===1">
              <span style="line-height:50px;padding-right:10px;">{{(UnitStepStates.candidateRegistrationCount1?UnitStepStates.candidateRegistrationCount1:0)+' / '+UnitStepStates.postReserveCount}}</span>
              <span style="padding:20px 10px;float:left;width:480px"><el-progress :stroke-width="10" :show-text="false" :percentage="100*(UnitStepStates.candidateRegistrationCount1?UnitStepStates.candidateRegistrationCount1:0)/UnitStepStates.postReserveCount"></el-progress></span>
            </template>
            <div v-else style="width:100px;margin:0 auto"><i class="custom icon_c_0" /> 未开始</div>
          </td>
          <td><el-button type="primary" @click="doit(10)">查看</el-button></td>
        </tr>
        <tr>
          <td>公示拟聘用人员名单</td>
          <td>拟聘人员公示</td>
          <td style="position:relative">
            <template v-if="planRelease.state===1&&planDeclare.state===1&&postDocking.state===1">
              <span style="line-height:50px;padding-right:10px;">{{(UnitStepStates.candidateAnnouncementCount4?UnitStepStates.candidateAnnouncementCount4:0)+' / '+UnitStepStates.postReserveCount}}</span>
              <span style="padding:20px 10px;float:left;width:480px"><el-progress :stroke-width="10" :show-text="false" :percentage="100*(UnitStepStates.candidateAnnouncementCount4?UnitStepStates.candidateAnnouncementCount4:0)/UnitStepStates.postReserveCount"></el-progress></span>
            </template>
            <div v-else style="width:100px;margin:0 auto"><i class="custom icon_c_0" /> 未开始</div>
          </td>
          <td><el-button type="primary" @click="doit(11)">查看</el-button></td>
        </tr>
        <tr>
          <td rowspan="3">签订聘用合同，办理聘用手续</td>
          <td>签订聘用合同</td>
          <td style="position:relative">
            <template v-if="planRelease.state===1&&planDeclare.state===1&&postDocking.state===1">
              <span style="line-height:50px;padding-right:10px;">{{(UnitStepStates.signContractCount1?UnitStepStates.signContractCount1:0)+' / '+UnitStepStates.postReserveCount}}</span>
              <span style="padding:20px 10px;float:left;width:480px"><el-progress :stroke-width="10" :show-text="false" :percentage="100*(UnitStepStates.signContractCount1?UnitStepStates.signContractCount1:0)/UnitStepStates.postReserveCount"></el-progress></span>
            </template>
            <div v-else style="width:100px;margin:0 auto"><i class="custom icon_c_0" /> 未开始</div>
          </td>
          <td><el-button type="primary" @click="doit(12)">查看</el-button></td>
        </tr>
        <tr>
          <td>落户备案</td>
          <td style="position:relative">
            <template v-if="planRelease.state===1&&planDeclare.state===1&&postDocking.state===1">
              <span style="line-height:50px;padding-right:10px;">{{(UnitStepStates.settlementRegistrationCount1?UnitStepStates.settlementRegistrationCount1:0)+' / '+UnitStepStates.postReserveCount2}}</span>
              <span style="padding:20px 10px;float:left;width:480px"><el-progress :stroke-width="10" :show-text="false" :percentage="100*(UnitStepStates.settlementRegistrationCount1?UnitStepStates.settlementRegistrationCount1:0)/UnitStepStates.postReserveCount2"></el-progress></span>
            </template>
            <div v-else style="width:100px;margin:0 auto"><i class="custom icon_c_0" /> 未开始</div>
          </td>
          <td><el-button type="primary" @click="doit(13)">查看</el-button></td>
        </tr>
        <tr>
          <td>聘用人员备案</td>
          <td style="position:relative">
            <template v-if="planRelease.state===1&&planDeclare.state===1&&postDocking.state===1">
              <span style="line-height:50px;padding-right:10px;">{{(UnitStepStates.registrationCount1?UnitStepStates.registrationCount1:0)+' / '+UnitStepStates.postReserveCount}}</span>
              <span style="padding:20px 10px;float:left;width:480px"><el-progress :stroke-width="10" :show-text="false" :percentage="100*(UnitStepStates.registrationCount1?UnitStepStates.registrationCount1:0)/UnitStepStates.postReserveCount"></el-progress></span>
            </template>
            <div v-else style="width:100px;margin:0 auto"><i class="custom icon_c_0" /> 未开始</div>
          </td>
          <td><el-button type="primary" @click="doit(14)">查看</el-button></td>
        </tr>
      </table>
      <div style="padding:10px;line-height:180%" v-html="'注：'+remarks.replace(/\n/g,'<br>')"></div>
      <!-- <div class="block" style="background:#F5F7FA;overflow:hidden">
        <div id="legent">
          <i class="custom icon_c_0"></i><div>未办理</div>
          <i class="custom icon_c_-1"></i><div>无需办理</div>
          <i class="custom icon_c_1"></i><div>待办理</div>
          <i class="custom icon_c_3"></i><div>已退回</div>
          <i class="custom icon_c_2"></i><div>已完成</div>
        </div>
      </div> -->
    </section>
  </div>
</template>

<script>
export default {
  data () {
    return {
      remarks: '',
      tableLoading: false,
      planDeclare: {},
      planRelease: {},
      postDocking: {},
      project: {
        planDeclareState: 0
      },
      yearLoading: false,
      theYear: null,
      yearList: [],
      step1: {
        allCount: 7,
        finishCount: 3
      },
      timestamp: '',
      changeType: '',
      substep: '',
      steppersonId: '',
      personId: '',
      jdcchuzhang: '',
      chuzhangs: [],
      tasknum: '',
      filters: {
        status: 1,
        personName: '',
        unitName: '',
        year: null
      },
      selectionlist: [],
      totalnum: 0,
      pageNum: 1,
      pageSize: 20,
      listLoading: true,
      changeSizeFlag: false,
      unitName: '',
      necessaryItems: [],
      mangeDep: [],
      tableHeight: 100,
      userRoles: '',
      jdcuserlist: [],
      jdcsetting: [],
      jdc1: '',
      jdc2: '',
      jdc3: '',
      jdc4: '',
      isReviewUser: null,
      UnitStepStates: {}
    }
  },
  methods: {

    getYear () {
      this.tableLoading = true
      this.$http
        .get(this.$http.defaults.recruitAPI + `api/recruitBusAnnual/queryList`)
        .then(response => {
          if (response.data.result && response.data.result.length > 0) {
            this.tableLoading = false
            this.yearList = response.data.result.map(item => item.theYear)
            let objYear = response.data.result.find(item => item.isCurrent)
            if (objYear) {
              this.theYear = objYear.theYear
            } else {
              this.theYear = response.data.result[0].theYear
            }
            this.getYearDetail()
          } else {
            this.$message({
              message: '未设置招聘年度',
              type: 'error'
            })
          }
        })
        .catch(error => {
          this.$message({
            message: '获取失败:' + error,
            type: 'error'
          })
          this.tableLoading = false
        })
    },
    // getYear () {
    //   this.tableLoading = true
    //   this.$http
    //     .get(this.$http.defaults.recruitAPI + `api/recruitBusAuth/currentYear`)
    //     .then(response => {
    //       this.tableLoading = false
    //       this.theYear = response.data.result
    //       this.yearList = []
    //       for (let i = this.theYear; i > this.theYear - 5; i--) {
    //         console.log(i)
    //         this.yearList.push(i)
    //       }
    //       this.getYearDetail()
    //     })
    //     .catch(error => {
    //       this.$message({
    //         message: '获取失败:' + error,
    //         type: 'error'
    //       })
    //       this.tableLoading = false
    //     })
    // },
    format (finishCount, allCount) {
      return finishCount + ' / ' + allCount
    },
    ftypename (type) {
      switch (type) {
        case 1:
          return '应届毕业生招聘'
        case 2:
          return '在职人员招聘'
        case 3:
          return '其他招聘'
      }
    },
    doit (step) {
      this.$router.push({name: 'recruitUnitDetail', query: {step: step, theYear: this.theYear}})
    },
    audit (id) {
      this.$router.push({name: 'recruitUnitAudit', query: {theYear: this.theYear}})
    },
    baseInfo (id) {
      this.$router.push({name: 'recruitUnitBaseInfo'})
    },
    personInfo (id) {
      this.$router.push({name: 'recruitUnitPerson'})
    },
    getYearDetail () {
      let para = {
        'pageNum': 1,
        'pageSize': 1
      }
      this.listLoading = true
      this.$http
        .post(this.$http.defaults.recruitAPI + `api/recruitBusBatch/queryMyUnitBatchByPage`, para)
        .then(response => {
          this.isReviewUser = response.data.result.isReviewUser
        })
        .catch(error => {
          this.$message({
            message: '获取失败:' + error,
            type: 'error'
          })
          this.listLoading = false
        })
      this.tableLoading = true
      this.$http
        .get(this.$http.defaults.recruitAPI + 'api/recruitBusUnit/getUnitStepStates?theYear=' + this.theYear)
        .then(response => {
          this.tableLoading = false
          if (response.data.success === true) {
            this.UnitStepStates = response.data.result
            this.planDeclare = response.data.result.plan_declare ? response.data.result.plan_declare : {state: 0}
            this.planRelease = response.data.result.plan_release ? response.data.result.plan_release : {state: 0}
            this.postDocking = response.data.result.post_docking ? response.data.result.post_docking : {state: 0}
          } else {
            this.$message({
              message: '获取失败:' + response.data.message,
              type: 'error'
            })
          }
        })
        .catch(error => {
          this.tableLoading = false
          console.log(error)
          this.$message({
            message: '获取失败:' + error,
            type: 'error'
          })
        })
      this.remarks = ''
      this.$http
        .get(this.$http.defaults.recruitAPI + 'api//recruitBusAnnual/getRemarksByYear?theYear=' + this.theYear)
        .then(response => {
          if (response.data.success === true) {
            this.remarks = response.data.result ? response.data.result : ''
          } else {
            this.$message({
              message: '获取失败:' + response.data.message,
              type: 'error'
            })
          }
        })
        .catch(error => {
          console.log(error)
          this.$message({
            message: '获取失败:' + error,
            type: 'error'
          })
        })
    },
    tableresize (obj) {
      var clientHeight = 0
      if (document.body.clientHeight && document.documentElement.clientHeight) {
        clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      } else {
        clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      }
      obj.$nextTick(function () {
        // obj.tableHeight = clientHeight - 292
        obj.tableHeight = clientHeight - 232
      })
    }
  },
  mounted () {
    this.getYear()
    this.tableresize(this)
    let _this = this
    window.onresize = function windowResize () {
      // 通过捕获系统的onresize事件触发我们需要执行的事件
      _this.tableresize(_this)
    }
  }
}
</script>
<style>
.recruitTable{
  font-family: '宋体';
  border-collapse:collapse;
}
.recruitTable th{
  background-image: linear-gradient(to bottom , #f8f8f8, #efefef);
  text-align: center;
}
.recruitTable th,
.recruitTable td{
  line-height: 250%;
  text-align: center;
  font-size: var(--size14);
  border-right: #95B8E7 solid 1px;
  border-bottom: #95B8E7 solid 1px;
}
.selectioncontent{
  border-bottom:1px solid #333;
  padding:5px !important;
}
  .pointtab .el-badge__content.is-fixed{
    right: -5px;
    top:18px;
  }
  .pointtab{
    padding-right:22px;
  }
  .pointRadio .el-badge__content.is-fixed{
    right: -5px;
    top:6px;
  }
  .pointRadio .el-radio-button__inner{
    height:40px;
    padding-left:15px;
    padding-right:42px;
  }
#recruitlist .el-table--border td, .el-table--border th, .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed{
  border-bottom:1px solid #95B8E7;
}
#recruitlist .el-table td, #recruitlist .el-table th.is-leaf{
  border-right:1px solid #95B8E7;
}
  .wboxd .el-table th{
    font-weight: normal;
    background-image: linear-gradient(to bottom , #f8f8f8, #efefef);
    text-align: center;
    border-right: #95B8E7 solid 1px;
    border-bottom: #95B8E7 solid 1px;
    min-height: 30px;
    line-height:30px;
  }
  .wboxd .el-table td{
    padding:0;
    font-size:var(--size14) !important;
    line-height: 20px;
    font-family: '宋体',
  }
  .tableth{
    background-image: linear-gradient(to bottom , #f8f8f8, #efefef);
    height:33px;
  }
  #recruitlist .wboxs{
    height:45px;
    padding-top:10px;
  }
  #recruitlist .el-table__row{
    height: 50px;
  }
  #recruitlist #legent{
    float:right;
    margin-right: 20px;
  }
  #recruitlist #legent div{
    float:left;
    line-height: 42px;
    font-size:var(--size12);
  }
  #recruitlist #legent i{
    width: 30px;
    height: 30px;
    background-position: center center;
    background-repeat: no-repeat;
    float: left;
    display: block;
    margin:5px 0px 0 3px;
  }
  #recruitlist i.custom{
    width: 30px;
    height: 30px;
    background-position: center center;
    background-repeat: no-repeat;
    float: left;
    display: block;
    margin:0 0 0 10px;
  }
  #recruitlist .icon_c_0{
    background-image: url(../assets/icon_selection_index0.png)
  }
  #recruitlist .icon_c_1{
    background-image: url(../assets/icon_selection_index2.gif)
  }
  #recruitlist .icon_c_2{
    background-image: url(../assets/icon_selection_index1.png)
  }
  #recruitlist .icon_c_-1{
    background-image: url(../assets/icon_selection_index-1.png)
  }
  #recruitlist .icon_c_3{
    background-image: url(../assets/icon_selection_index3.png)
  }
  #recruitlist .icon_c_3a{
    background-image: url(../assets/icon_selection_index4t.png)
  }
  #recruitlist .icon_c_3b{
    background-image: url(../assets/icon_selection_index3b.png)
  }
  #recruitlist .icon_c_4{
    background-image: url(../assets/icon_selection_index4t.png)
  }
  #recruitlist .icon_c_5{
    background-image: url(../assets/icon_selection_index4r.png)
  }
  #recruitlist .icon_gd_0{
    background-image: url(../assets/icon_selection_gd0.png)
  }
  #recruitlist .icon_gd_1{
    background-image: url(../assets/icon_selection_gd1.gif)
  }
  #recruitlist .icon_gd_2{
    background-image: url(../assets/icon_selection_gd2.png)
  }
  #recruitlist .icon_gd_4{
    background-image: url(../assets/icon_selection_gd4.png)
  }
  #recruitlist .el-step__title.is-finish {
    color: #409EFF;
  }
  #recruitlist .el-step__title {
    font-size:12px;
    line-height: 22px;
    padding-left: 8px;
  }
  #recruitlist .el-steps{
    margin:10px 0;
  }
  .el-tooltip__popper.is-dark{
    font-size:var(--size18) !important;
  }
  .el-tabs--card>.el-tabs__header {
    border-bottom: 1px solid #9CA3B3;
  }
  .el-tabs--card>.el-tabs__header .el-tabs__nav {
    border: 1px solid #9CA3B3;
    border-bottom: 0;
  }
  .el-tabs--card>.el-tabs__header .el-tabs__item {
    border-left: 1px solid #9CA3B3;
    /* background-color: #F0F0F0; */
  }
  .el-tabs__item.is-active {
    color: #0000FF !important;
    font-weight: bolder !important;
    /* background-color: #fff !important; */
    /* border-bottom: 2px solid #9CA3B3 !important; */
  }
</style>
<style scoped>
  .el-tooltip__popper{
    font-size:var(--size) !important;
  }
  h1{
    font-size:var(--size16) !important;
    font-weight: bolder;
    height: 30px;
    border-bottom: 1px solid #95B8E7;
    font-family: '宋体';
    line-height: 30px;
    color: #000;
    padding-left:10px;
    background-image: linear-gradient(to bottom , #EEF4FF, #E0ECFF);
    margin:0;
  }
  .el-pagination{
    float: left;
    padding:7px 10px;
  }
  .wboxs{
    padding:5px 15px;
    width: calc(100% - 30px);
    background: #fff;
    border: 1px solid #95B8E7;
    margin:0 10px;
    overflow: hidden;
  }
  .wboxd{
    padding:0;
    width: calc(100% - 0px);
    background: #fff;
    border: 1px solid #95B8E7;
    margin:0 10px;
    overflow: hidden;
  }
</style>
